<template>
  <view class="page page-grey page-aftersale-negotiation">
    <view class="aftersale-negotiation-item" v-for="i in 3" :key="i">
      <view class="negotiation-item-header">
        <image class="negotiation-item-avatar" src="/static/images/company/person-head.png"></image>
        <view class="negotiation-item-title">
          <view class="negotiation-item-text"><fui-text text="退款成功" size="28" fontWeight="bold" color="#333"></fui-text></view>
          <view class="negotiation-item-text"><fui-text :text="utils.dateFormatter(182892992993, 'y-m-d h:i:s', 2, true)" size="24" color="#999"></fui-text></view>
        </view>
      </view>
      <view class="negotiation-item-content">
        <view class="negotiation-item-text"><fui-text text="退款地址：广东省惠州市惠东县大岭镇洪湖学校后面鑫足丽(二)" size="24" color="#666"></fui-text></view>
        <view class="negotiation-item-text"><fui-text text="收件人：黄小姐（15766658427）" size="24" color="#666"></fui-text></view>
        <view class="negotiation-item-text"><fui-text text="备注：亲，您的退货申请已通过，请将商品包装好寄回" size="24" color="#666"></fui-text></view>
      </view>
      <view class="negotiation-item-footer">
        <view class="negotiation-item-link"><fui-icon name="transport" size="36" color="#333"></fui-icon><fui-text text="查看物流" size="24" color="#333"></fui-text></view>
        <view class="negotiation-item-link"><fui-icon name="order" size="34" color="#333"></fui-icon><fui-text text="复制地址" size="24" color="#333"></fui-text></view>
      </view>
    </view>
  </view>
</template>

<script setup>
import { ref, computed, inject } from 'vue'
import { onShow } from "@dcloudio/uni-app"
import { useStore } from 'vuex'
import utils from '@/components/firstui/fui-utils'

const tab = inject('$tab')
const modal = inject('$modal')
const store = useStore()
</script>

<style lang="scss" scoped>
.page-aftersale-negotiation {
  padding: 36rpx;
  .aftersale-negotiation-item {
    border-radius: 12rpx;
    background-color: #fff;
    margin-bottom: 30rpx;
    padding: 28rpx;
    .negotiation-item-text {
      margin-bottom: 10rpx;
    }
    .negotiation-item-header {
      display: flex;
      align-items: center;
      margin-bottom: 20rpx;
      .negotiation-item-avatar {
        flex: 0 0 64rpx;
        width: 64rpx;
        height: 64rpx;
        margin-right: 12rpx;
      }
      .negotiation-item-title {
        line-height: 1;
        .negotiation-item-text {
          margin-bottom: 0;
        }
      }
    }
    .negotiation-item-content {
      border-top: 2rpx solid #F2F4F5;
      padding: 16rpx 0;
    }
    .negotiation-item-footer {
      display: flex;
      justify-content: flex-end;
      border-top: 2rpx solid #F2F4F5;
      padding-top: 20rpx;
      .negotiation-item-link {
        display: flex;
        align-items: center;
        margin-left: 20rpx;
        .fui-icon {
          margin-right: 4rpx;
        }
      }
    }
  }
}
</style>